<template>
	<view>
		<view class="content">
			<view class="li">
				<view class="li_1">
					性别
				</view>
				<radio-group @change="radioChange">
					<label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in items" :key="item.value">
						<view>
							<radio :value="item.value" :checked="index === current" />
						</view>
						<view>{{item.name}}</view>
					</label>
				</radio-group>
			</view>
			<view class="queding" @click="queding">
				<view>
					确定
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		editUser
	} from '@/request/api.js'
	export default {
		data() {
			return {
				items: [{
						value: '1',
						name: '男'
					},
					{
						value: '2',
						name: '女',

					},

				],
				current: 0,
				user: '',
				gender: '',
				id: '',

			}
		},
		onLoad() {
			let that = this
			that.user = uni.getStorageSync('regionMessage');
			that.gender = that.user.gender
			that.id = that.user.id
			console.log(that.gender)
		},
		methods: {
			radioChange: function(evt) {
				console.log(evt)
				if (evt == 0) {
					that.gender=1
				}
				if (evt == 1) {
					that.gender=2
				}
				for (let i = 0; i < this.items.length; i++) {
					if (this.items[i].value === evt.detail.value) {
						this.current = i;
						console.log(this.current)
						break;
					}
				}
			},
			queding() {
				let that = this
				let data = {
					user_id: that.id,
					gender: that.gender
				}
				editUser(data).then(res => {
					console.log(res)
					if(res.code==1){
						uni.showToast({
							title: '修改成功',
							icon: 'none'
						})
					}
					
					setTimeout(function(){
						uni.navigateBack({
							delta:1
						})
					},600)
				}).catch(err => {

				})
			}

		}
	}
</script>

<style lang="scss">
	label {
		display: flex;
		width: 200rpx;
		align-items: center;
	}

	radio-group {
		display: flex;
		align-items: center;
	}

	.queding {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 200rpx;

		view {
			width: 340rpx;
			height: 80rpx;
			line-height: 80rpx;
			border-radius: 1000px;
			background: #1855F6;
			font-size: 30rpx;
			color: #fff;
			text-align: center;
		}
	}

	.li {
		padding: 33rpx 40rpx;
		display: flex;
		align-items: center;
		border-top: 1px solid rgba(211, 213, 220, 0.4);
		border-bottom: 1px solid rgba(211, 213, 220, 0.4);

		.li_1 {
			width: 220rpx;
		}
	}
</style>
